import React, { Component } from 'react'

export default class App extends Component {

  state = {
    count: 100
  }

  render() {
    return (
      <div>
        <h1> {this.state.count} </h1>

        <button onClick={function(){
          // 直接在这里写 function，普通函数会导致 this 是一个 undefined
          // 点击事件中不能直接使用普通函数
          console.log('被点击了', this);
        }}>增加</button>

        {/*
          i++   先用在加
          ++i   先加在用
        */}

        <button onClick={()=>{
          // 行内写的时候可以使用箭头函数的方式进行使用
          console.log('被点击了', this);
          // 这样使用是不规范的，相当于直接操作的源数据 count
          // this.setState({
          //   count: ++this.state.count
          // })


          this.setState({
            count: this.state.count + 1
          })
        }}>点击增加</button>
      </div>
    )
  }
}
